<template>
    <div class="btn" style="display: inline-block;border-radius: 5px;border: 1px solid rgba(0,0,0,0.2);padding: 8px 16px;user-select: none;">
        <slot></slot>
    </div>
</template>

<script setup>
import { ref, reactive, defineProps, computed, watch, onMounted, onBeforeUnmount } from 'vue'

onMounted(async () => {

})
</script>

<style scoped>
.btn:hover{
    background-color: rgba(0,0,0,0.1);
}
.btn:active{
    background-color: rgba(0,0,0,0.05);
}
</style>